<div id="introWrap">
	<h3>Trail maps generated from geotagged images in on-line web albums  </h3>





			{%if user %}
				<p class="banner" id="editme" style="visibility:visible"> 
				<a href="/routeList" class="nav" >EDITOR</a> 
		 		Edit or Create route </p>
				
			{%endif%}

<div id="searchBox">

  <form method="post" id="frmSearchBox">

Search Routes: <br>
<table WIDTH=100%>
<tr><th>State</th><th>Type</th><th>Organization</th><th>Location</th>
</tr><tr><td>
	<SELECT name="states"  id="states" style="width: 6em;">
		{% for stt in states %}
  			<option  name="op" value="{{ stt }}" {% ifequal stt "All" %} SELECTED {% endifequal %}  >{{ stt }}
		{% endfor %}	
	</SELECT>
</td><td>
	<SELECT name="types" id="types" style="width: 6em;">
		{% for typ in types %}
 	 		<option name="op"  value="{{ typ }}" {% ifequal typ "All" %} SELECTED {% endifequal %}  >{{ typ }}
		{% endfor %}	
	</SELECT>
</td><td>
	<SELECT name="orcas" id="orcas" style="width: 6em;">
		{% for orc in orcas %}
  			<option  name="op" value="{{ orc }}" {% ifequal orc "All" %} SELECTED {% endifequal %}  >{{ orc }}
		{% endfor %}	
	</SELECT>
</td><td>
	<SELECT name="locas" id="locas" style="width: 10em;">
		{% for loc in locas %}
  			<option  name="op" value="{{ loc }}" {% ifequal loc "All" %} SELECTED {% endifequal %}  >{{ loc }}
		{% endfor %}	
	</SELECT>
</td><td>
	<input type="button" name="btnSearch" value="Submit" onclick="searchRoutes();">
</td></tr></table>
</FORM>
	
 </div>
	
	Showing routes: {{ statefilter }}
	{% for route in routes %}

	 	 <div id = "{{ forloop.counter }}_nodepad" onmouseover="selectObj( {{ forloop.counter }},{{ route.latitude }},{{ route.longitude }} ); return false;" class="imgdata" >
		<div class="banner" >
		    
		<button type="button" id="btnPlay" name="btnPlay" class="nav" onclick="playView('{{ route.key }}','{{ route.latitude }}','{{ route.longitude }}','{{ route.zoom }}')" > play </button>

<button type="button" id="btnMap" name="btnMap" class="nav" onclick="mapView('{{ route.key }}','{{ route.latitude }}','{{ route.longitude }}')" > map </button>


<button type="button" id="{{ forloop.counter }}_btnLink" name="{{ forloop.counter }}_btnLink" class="nav" onclick="showLink('{{ route.key }}', '{{ forloop.counter }}')" > link </button>
		
		</div> 
		<ul > 
			<li> 	       {{ route.routeName }}
			<li> <b>Location:  &nbsp;  </b>                {{route.locationName}}
			<li> <b>state:  &nbsp;  </b>                {{route.state}}
			<li> <b> Description: &nbsp; </b>              {{route.intro }}
			<li> <b> Author: &nbsp; &nbsp; </b>            {{ route.author }}
		</ul> 
		<img src="{{ route.img }}?imgmax=512" alt="{{route.routeName }}"   /> 

	</div>

{% endfor %}
</div>

